<template>
	<view class="container">
		<uni-list>
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="昵称" :rightText="user.nickname" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'phone-filled' }" title="手机号码" :rightText="user.mobile" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'email-filled' }" title="邮箱" :rightText="user.email" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="所属社区" :rightText="user.dept.name" />
			<uni-list-item
				showExtraIcon="true"
				:extraIcon="{ type: 'staff-filled' }"
				title="角色"
				:rightText="(user.roles || []).map((role) => role.name).join(',')"
			/>
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="创建日期" :rightText="this.parseTime(user.createTime)" />
		</uni-list>
		<view class="footer-button">
			<u-button :ripple="true" type="primary" size="medium" shape="circle" @click="loginOut">退出登录</u-button>
		</view>
	</view>
</template>

<script>
import { getUserProfile } from '@/api/system/user'
import { parseTime } from '@/utils/ruoyi'

export default {
	data() {
		return {
			user: {}
		}
	},
	onLoad() {
		this.getUser()
	},
	methods: {
		getUser() {
			getUserProfile().then((response) => {
				this.user = response.data
			})
		},
		parseTime(time) {
			return parseTime(time)
		},
    loginOut() {
      uni.showModal({
        title: '提示',
        content: '是否确认退出登录',
        success: function (res) {
          if (res.confirm) {
            uni.clearStorage()
            setTimeout(function() {
              uni.reLaunch({ url: '/pages/login/phonelogin/index' })
            }, 100);
          }
        }
      });
    }
	}
}
</script>

<style lang="scss">
page {
	background-color: #ffffff;
	.footer-button {
		left: 0;
		right: 0;
		margin: auto;
		margin-bottom: constant(safe-area-inset-bottom);
		margin-bottom: env(safe-area-inset-bottom);
		position: fixed;
		bottom: 40rpx;
		width: 600rpx;
	}
}
</style>
